﻿@model SchoolCommunicationSystem.Models.TeacherViewModels
@{
    ViewBag.Title = "GradesByDate";
    Layout = "~/Views/Shared/_TeacherLayout.cshtml";
}
@Scripts.Render("~/bundles/tablesorter")
@Scripts.Render("~/bundles/tablesorterpaging")
<script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.ui.datepicker-vi-VN.js")" type="text/javascript"></script>
<script>
    $(function () {
        $.validator.addMethod('date',
        function (value, element) {
            if (this.optional(element)) {
                return true;
            }
            var ok = true;
            try {
                $.datepicker.parseDate('dd/mm/yy', value);
            }
            catch (err) {
                ok = false;
            }
            return ok;
        });
        $(".datefield").datepicker({ dateFormat: 'dd/mm/yy', yearRange: '1950:2020', changeYear: true, changeMonth: true });
    });
</script>
<script type="text/javascript">
    $(function () {

        $("table")
            .tablesorter({
                widthFixed: true, widgets: ['zebra']
            })
            .tablesorterPager({ container: $("#pagersorter") });
    });
</script>
<div id="page-heading">
    <h1>Tình Trạng Học Tập</h1>
</div>
<div class="container">
    <div class="row">
        <div class="col-sm-12">
            <div class="panel panel-primary">
                <div class="panel-heading">
                    <h4>Điểm theo ngày</h4>
                </div>
                <div class="panel-body">
                    <div class="module_contentwithsearch">
                        @using (Html.BeginForm("ViewGradesByDate", "TeacherView", FormMethod.Post, new { @class = "form-horizontal" }))
                        { 
                            <div class="form-group" style="margin-bottom: 0px;">

                                @Html.Label("Mốc thời gian đầu:", new { @class = "col-sm-2" })
                                <div class="col-sm-2">
                                    @Html.EditorFor(model => model.firstDate)
                                </div>
                                <div class="col-sm-1">
                                    @Html.ValidationMessageFor(model => model.firstDate)
                                </div>
                                @Html.Label("Mốc thời gian cuối:", new { @class = "col-sm-2" })
                                <div class="col-sm-2">
                                    @Html.EditorFor(model => model.lastDate)
                                </div>
                                <div class="col-sm-1">
                                    @Html.ValidationMessageFor(model => model.lastDate)
                                </div>
                                <div class="col-sm-3">
                                    <button class="btn-primary btn searchbtn" type="submit" style="padding: 4px 15px; font-size: 13px; font-weight: 500;">Tìm kiếm</button>
                                </div>
                            </div>
                        }
                    </div>
                    <div class="module_contentresult">
                        <br />
                        <table class="tablesorter">
                            <thead>
                                <tr>
                                    <th>Lớp</th>
                                    <th>Mã học sinh</th>
                                    <th>Họ tên học sinh</th>
                                    <th>Môn học</th>
                                    <th>Ngày cho điểm</th>
                                    <th>Loại điểm</th>
                                    <th>Điểm</th>
                                    <th>Kỳ học</th>
                                </tr>
                            </thead>
                            <tbody>
                                @foreach (var item in Model.grade)
                                {
                                    <tr>
                                        <td>@item.Learner.Class.ClassInSchoolYears.FirstOrDefault().className</td>
                                        <td>@item.learnerID</td>
                                        <td>@item.Learner.firstName @item.Learner.lastName</td>
                                        <td>@item.Subject.subjectName</td>
                                        @if(item.createDate.HasValue)
                                        {
                                        <td>@item.createDate.Value.ToString("dd/MM/yyyy")</td>
                                        }
                                        else
                                        {
                                            <td></td>
                                        }
                                        <td>@item.GradeType.gradeTypeName</td>
                                        <td>@item.grade1</td>
                                        <td>@item.Term.termName</td>
                                    </tr>
                                }
                            </tbody>
                        </table>
                        <div id="pagersorter" class="pagersorter" style="clear: both;">
                            <form>
                                <img src="../../Content/images/first.png" class="first" />
                                <img src="../../Content/images/prev.png" class="prev" />
                                <input type="text" class="pagedisplay" />
                                <img src="../../Content/images/next.png" class="next" />
                                <img src="../../Content/images/last.png" class="last" />
                                <select class="pagesize">
                                    <option selected="selected" value="10">10</option>
                                    <option value="20">20</option>
                                    <option value="30">30</option>
                                    <option value="40">40</option>
                                </select>
                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
